<template>
  <div class="see_spot">
    <el-dialog title="门票详情" :visible.sync="isShowDia" width="70%" :before-close="handleClose">
      <el-form :model="seeDiaInfo" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="景区名称:">
              {{ seeDiaInfo.jingquName ? seeDiaInfo.jingquName : "--" }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="门票配置:">
              <el-table :data="seeDiaInfo.menPiaoCategorys" style="width: 100%" border>
                <el-table-column prop="menpiaoName" label="门票名称" align="center" />
                <el-table-column prop="menpiaoPrice" label="门票价格" align="center" />
                <el-table-column prop="menpiaoNote" label="门票备注" align="center" />
              </el-table>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="门票数量配置:">
              <el-table :data="seeDiaInfo.menPiaoTimes" style="width: 100%" border>
                <el-table-column label="入园时段" align="center">
                  <template slot-scope="scope">
                    {{ scope.row.startTime }} ~ {{ scope.row.endTime }}
                  </template>
                </el-table-column>
                <el-table-column prop="total" label="门票总数" align="center" />
                <el-table-column prop="menpiaoNote" label="所占比例及对应数量" align="center">
                  <template slot-scope="scope">
                    <p v-for="(i, index) in scope.row.menPiaoNums" :key="index">
                      {{ seeDiaInfo.menPiaoCategorys[index].menpiaoName }}
                      {{ i.menpiaoPercent }}*{{ i.menpiaoNum }}
                    </p>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: {
    isShowDia: {
      type: Boolean,
      default: () => false,
    },
    seeDiaInfo: {
      type: Object,
      default: () => { },
    }
  },
  data() {
    return {};
  },
  created() { },
  computed: {
    jingquId() {
      return this.seeDiaInfo.jingquId;
    },
  },

  methods: {

    // 根据传入的index和数组，获取名称
    getTypeName(index, arr) {
      // seeDiaInfo.menPiaoCategorys
      return arr[index].menpiaoName
    },

    handleClose() {
      this.$emit("closeSeeDia");
    },
    getFileType(filePath) {
      const linkParts = filePath.split(".");
      if (linkParts.length > 1) {
        return linkParts[linkParts.length - 1];
      } else {
        return "Unknown";
      }
    },
  },
};
</script>
<style lang="scss" scoped>
</style>
